<template>
	<view>
		<cu-custom bgColor="bg-gradual-blue-light" :isBack="true" backText="返回" title="银行卡识别">
		</cu-custom>  
		<!-- #ifdef MP-WEIXIN-->
		<camera device-position="back" flash="auto" @error="error" style="width: 100%; height: 500rpx;">
			<cover-image src="/pages/society/my/static/scan-frame/scan-img.png" class="scan-img"></cover-image>
		</camera>
		<!-- #endif-->
		<view class="scan-text" style="padding-top: 20rpx;" >请将银行卡放置白色框内</view>
		<view class="flex flex-direction" style="padding-top: 10rpx;">
			<button class="cu-btn shadow margin-tb-sm lg bg-gradual-blue-light" @click="takePhoto">识<text style="width: 50rpx;"></text>别</button>
		</view>
		<image mode="widthFix" class="photos-box" :src="src"></image>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				src: ""
			}
		},
		methods: {
			takePhoto() {
				//#ifdef MP-WEIXIN
				const ctx = uni.createCameraContext();
				ctx.takePhoto({
					quality: 'high',
					success: (res) => {
						this.src = res.tempImagePath
						/* 返回调用页面并把图片URL传递过去 */
						/* let pages = getCurrentPages();
						let prevPage = pages[pages.length - 2]; 
						prevPage.setData({
							"image": res.tempImagePath,
						})
						uni.navigateBack(); */
						
						/* 调用页面获取图片URL方法 */
						/* let pages = getCurrentPages();
						let currPage = pages[pages.length-1];
						if(typeof(currPage.data.image) != undefined && currPage.data.image != null){
							console.log('获取图片：', currPage.data.image)
						} */
					}
				});
				// #endif
			},
			error(e) {
				console.log(e.detail);
			}
		}
	}
</script>

<style>
	.scan-img{
		opacity: 0.4;
		width: 100%;
		height:500upx;
	}
	.scan-text{
		font-size: 20px;
		text-align: center;
		line-height: 60rpx;
		color: #aaaaaa;
	}
</style>
